<template>
    <el-select :value="value" :clearable="clearable" :disabled="disabled" placeholder="请选择" @change="changeSelectedNodes">
        <el-option v-for="item in options" :key="item.sysdict_code" :label="item.sysdict_name" :value="item.sysdict_code" />
    </el-select>
</template>

<script>

export default {
    name: 'DictSelect',
    model: {
        prop: 'value',
        event: 'change'
    },
    props: {
        dict: String,
        value: [String, Number],
        clearable: {
            type: Boolean,
            default: true
        },
        disabled: {
            type: Boolean,
            default: false
        }
    },
    data() {
        return {
            options: []
        };
    },
    computed: {

    },
    watch: {
        value() {

        },
        dict: {
            handler() {

            },
            immediate: true
        }
    },
    mounted() {
        this.$store.dispatch('sysdict/getDict', this.dict).then(res => {
            this.options = res;
        }).catch(() => {

        });
    },
    methods: {
        changeSelectedNodes(selectedData) {
            this.$emit('change', selectedData);
            let label = selectedData ? this.options.find(ele => ele.sysdict_code === selectedData).sysdict_name : '';
            this.$emit('illegal-condition', index);
            this.$emit('update:name', label);
        }
    }
};
</script>
